/**
 * 修改库位
 */
<template>
<vp-dialog ref="editDialogRef" :span="1">
	<template #title>
		<vp-label-add v-if="type === 'add'"/>
        <vp-label-edit v-else/>
	</template>
	<el-form v-loading="loading" :model="formData" :rules="formRules" ref="formRef" label-width="120px" :scroll-to-error="true">
		<el-row>
			<vp-col :span="2">
				<el-form-item>
					<template #label><vp-label zh="仓库号" en="Warehouse No." align="left"/></template>
					{{ currentModule.bh }}
				</el-form-item>
			</vp-col>
			<vp-col :span="2">
				<el-form-item>
					<template #label><vp-label zh="仓库名称" en="Warehouse Name" align="left"/></template>
					{{ currentModule.mc }}
				</el-form-item>
			</vp-col>
			<vp-col :span="1">
				<el-form-item prop="kw">
					<template #label>
						<div style="display:flex;flex-direction: column;lign-items: center;justify-content: center;">
							<vp-label zh="库位" en="Location" align="left"/>
							<el-button type="text" @click="handleFormat" >{{'格式化/Format' }}</el-button>
						</div>
					</template>
					<el-input v-model="formData.kw" v-trim type="textarea" placeholder="可使用, 或换行批量填写库位" rows="5"></el-input>
				</el-form-item>
			</vp-col>
			<vp-col :span="1">
				<el-form-item prop="bz">
					<template #label>
						<vp-label zh="备注" en="Remark" align="left"/>
					</template>
					<el-input v-model="formData.bz" type="textarea" v-trim maxlength="1000"></el-input>
				</el-form-item>
			</vp-col>
		</el-row>
	</el-form>
	<template #footer>
		<vp-btn-confirm :loading="saveLoading" @click="handleSave"/>
	</template>
</vp-dialog>
</template>
<script setup lang="ts" name="addLocation">
	import { ref } from 'vue'
	import request from '/@/utils/request';
	import validateUtils from '/@/utils/validateUtils';

	const emits = defineEmits(['formSubmited']);

	// 当前选中模块
	const currentModule = ref({
		id: "",
		bh: "",
		mc: "",
	});

	const formData = ref({
        id: "",
		mainid: "",
		kw: "",
		bz: "",
    });

	const formRules = {
		kw: [ validateUtils.notNull ]
    }

	const loading = ref(false);
    const saveLoading = ref(false);
    const type = ref('add');
	const editDialogRef = ref();
	const formRef = ref();

	// 打开弹窗
	const handleOpen = (__type: string, module: any, id: string) => {
		type.value = __type;
		currentModule.value = module;
		initFormData();
		editDialogRef.value.handleOpen();
		if (__type === 'edit') {
			loading.value = true;
			request.get(`/masterData/warehouse/location/${id}`).then((res) => {
				formData.value = {
					...formData.value,
					...res.data
				};
				loading.value = false;
			})
		}
	};

	// 清空数据
	const initFormData = () => {
		formData.value = {
			id: "",
			mainid: "",
			kw: "",
			bz: "",
		}
	}

	// 保存库位
	const handleSave = () => {
		if (loading.value) {
			return;
		}
		saveLoading.value = true;
		formRef.value.validate((valid: Boolean) => {
			if (valid) {
				let obj = {
					id : currentModule.value.id
				};
				let list = formatData(formData.value.kw);
				let locations = list.map((str: string) =>{
					return {
						mainid: currentModule.value.id,
						kw: str,
						bz: formData.value.bz
					}
				})
				request.post("/masterData/warehouse/location/save", {
					...obj,
					locations: locations
				}).then(() => {
					emits("formSubmited");
					editDialogRef.value.handleClose();
				}).catch(()=>{
                }).finally(()=>{
					saveLoading.value = false;
				})
			} else {
				saveLoading.value = false;
			}
		})
	}

	const handleFormat = () =>{
		if(formData.value.kw){
			formData.value.kw = (formatData(formData.value.kw)|| []).join("\n");
		}
	}

	const formatData = (str: string) =>{
		let kw = str.replaceAll(",\n", "\n").replaceAll("，\n", "\n").replaceAll("，", "\n").replaceAll(",", "\n");
		const arr = kw.split("\n");
		let list =[] as string[];
		(arr || []).forEach((str: string) =>{
			if(list.indexOf(str) == -1 && "" !== str){
				list.push(str.length > 100 ? str.substring(0, 100) : str);
			}
		})
		return list;
	}

	defineExpose({
        handleOpen,
    })
</script>
